<template>
  <div>
    <a-modal
      :title="title"
      :width="width"
      :visible="visible"
      :maskClosable="false"
      :confirmLoading="confirmLoading"
      @ok="handleOk"
      @cancel="handleCancel"
      cancelText="关闭">
      <a-descriptions bordered :column="num">
        <template v-for="(item,index) in superFieldList">
          <a-descriptions-item :label="item.text" :key="index">
            {{ concatDictText(item) }}
          </a-descriptions-item>
        </template>
        <slot name="privateField"></slot>
      </a-descriptions>
    </a-modal>
  </div>
</template>

<script>
  import { initDictOptionsByDictCodeList, filterDictTextByCache } from '@comp/dict/JDictSelectUtil'
  import { getAction } from '@api/manage'
  import { randomUUID } from '@/utils/util'

  export default {
    name: 'CommonDetailForm',
    props: {
      // 控制一行展示内容的数量
      num: {
        type: Number,
        default: 3
      },
      width: {
        type: Number,
        default: 800
      },
      // 外面传进来要展示的字段
      superFieldList: {
        type: Array,
        default: () => []
      },
      queryById: {
        type: String,
        default: ''
      }
    },
    data() {
      return {
        title: '查看详情',
        visible: false,
        confirmLoading: false,
        model: {}
      }
    },
    computed: {
      concatDictText() {
        return (item) => {
          if (item.dictCode) {
            return filterDictTextByCache(item.dictCode, this.model[item.value]) || '-'
          } else {
            return this.model[item.value] || '-'
          }
        }
      },
      dictList() {
        return () => {
          this.superFieldList.filter((item) => {
            if (item.dictCode !== '' && item.dictCode !== undefined) {
              return item.dictCode
            }
          })
        }
      }
    },
    created() {
      this.initData()
    },
    methods: {
      filterDictTextByCache: filterDictTextByCache,
      async initData() {
        // 初始化字典配置
        await initDictOptionsByDictCodeList(this.dictList)
        this.$forceUpdate()
      },
      open(record) {
        this.visible = true
        this.model = Object.assign({}, record)
        // queryById方法请求数据
        if (this.queryById !== '') {
          if (record.id) {
            let params = { id: record.id }
            this.confirmLoading = true
            getAction(this.queryById, params).then((res) => {
              if (res.success) {
                let data = res.data || res.result
                this.model = Object.assign({}, { ...data })
                this.model.fromActionToken = randomUUID()
              }
            }).finally(() => {
              this.confirmLoading = false
            })
          }
        }
      },
      handleOk() {
        this.close()
      },
      handleCancel() {
        this.close()
      },
      close() {
        this.$emit('close')
        this.visible = false
      }
    }
  }
</script>

<style scoped>

</style>
